<template>
  <div>
    <!-- 搜索框 -->
    <el-form :inline="true" :model="searchForm">
      <auth-form-items v-model="searchForm" search-type="AUTH"/>
      <auth-info-form-items
        v-if="searchForm.mode"
        v-model="searchForm.authInfoSearch" :mode="searchForm.mode"
        search-type="AUTH"
      />
      <auth-info-resource-form-items
        v-if="searchForm.mode&&searchForm.authInfoSearch.authService&&searchForm.authInfoSearch.authType"
        v-model="searchForm.authInfoSearch.authInfoResourceSearch"
        :mode="searchForm.mode"
        :auth-service="searchForm.authInfoSearch.authService"
        :auth-type="searchForm.authInfoSearch.authType"
        search-type="AUTH"
      />

      <el-button type="normal" @click="resetPageRequestBody()">重 置</el-button>
      <el-button type="primary" @click="page()">搜 索</el-button>
    </el-form>

    <el-button type="primary" @click="openExcel()">
      导出申请记录
    </el-button>
    <el-button type="primary" @click="openApplyDialog(null,'NORMAL')">
      权限申请
    </el-button>
    <el-button type="primary" @click="openApplyDialog(null,'QUICK')">
      快速申请
    </el-button>

    <el-table :data="tableList" border>
      <el-table-column fixed label="ID" prop="id" min-width="50"/>
      <el-table-column label="标题" prop="title" min-width="100"/>
      <el-table-column label="申请说明" prop="applyRemark" min-width="100"/>
      <el-table-column label="状态" prop="state" min-width="80">
        <template v-slot="scope">
          {{ labelMap['STATE.' + scope.row.state] }}
        </template>
      </el-table-column>
      <el-table-column label="申请模式" prop="mode" min-width="80">
        <template v-slot="scope">
          {{ labelMap['MODE.' + scope.row.mode] }}
        </template>
      </el-table-column>
      <el-table-column label="申请人" prop="applyUser" min-width="80">
        <template v-slot="scope">
          {{ scope.row.applyUser.cn }}
        </template>
      </el-table-column>
      <el-table-column label="申请时间" prop="applyTime" min-width="160">
        <template v-slot="scope">
          {{ scope.row.applyTime|transformDateFormat }}
        </template>
      </el-table-column>
      <el-table-column fixed="right" label="操作" width="100">
        <template v-slot="scope">
          <el-button
            v-if="approveButtonVisible(scope.row)" type="text"
            @click="openApproveDialog(scope.row)"
          >
            审批
          </el-button>
          <el-button
            v-if="approveRetryButtonVisible(scope.row)" type="text"
            @click="retry(scope.row.id)"
          >
            重试
          </el-button>
          <el-button type="text" @click="openDetailDialog(scope.row)">详情</el-button>
          <el-button
            type="text"
            @click="openApplyDialog(scope.row.id,scope.row.mode)"
          >
            复制
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination
      :current-page="parseInt(pageParam.current)" :total="pageParam.total" :page-size="pageParam.size"
      :page-sizes="pageParam.sizes"
      :style="pageParam.style" :layout="pageParam.layout"
      @current-change="page" @size-change="changeSize"
    />

    <apply-dialog :auth-id="currentRowId" :dialog-visible="applyDialogVisible" :mode="mode"/>
    <detail-dialog :auth-id="currentRowId" :dialog-visible="detailDialogVisible"/>
    <approve-dialog :auth-id="currentRowId" :dialog-visible="approveDialogVisible"/>
  </div>
</template>

<script>
import ApplyDialog from "@/views/auth/apply/applyDialog.vue";
import {createPageRequestBody} from "@/api/system/pagination";
import {excel, label, page, retry} from "@/api/auth/auth";
import ApproveDialog from "@/views/auth/apply/approveDialog.vue";
import DetailDialog from "@/views/auth/apply/detailDialog.vue";
import AuthFormItems from "@/views/auth/account/authFormItems.vue";
import AuthInfoFormItems from "@/views/auth/account/authInfoFormItems.vue";
import AuthInfoResourceFormItems from "@/views/auth/account/authInfoResourceFormItems.vue";
import {download} from "@/utils/download";

export default {
  name: "Index",

  components: {
    AuthInfoResourceFormItems,
    AuthInfoFormItems,
    AuthFormItems,
    DetailDialog,
    ApproveDialog,
    ApplyDialog
  },

  data() {
    return {
      mode: 'NORMAL',
      searchForm: {},
      initForm: {authInfoSearch: {authInfoResourceSearch: {resource: {}}}},
      pageParam: createPageRequestBody(),
      tableList: null,
      applyDialogVisible: false,
      quickApplyDialogVisible: false,
      detailDialogVisible: false,
      approveDialogVisible: false,
      currentRowId: null,
      resourceList: null,
      labelMap: null,
    }
  },

  created() {
    label().then(res => {
      this.labelMap = res.data
      this.page()
    })
    this.resetPageRequestBody()
  },

  methods: {
    resetPageRequestBody() {
      this.searchForm = JSON.parse(JSON.stringify(this.initForm))
      this.pageParam = createPageRequestBody()
      this.page()
    },

    page(current = 1) {
      this.pageParam.current = current
      page(this.searchForm, this.pageParam.current, this.pageParam.size, false).then(res => {
        this.tableList = res.data.records
        this.pageParam.total = res.data.total
      })
    },
    changeSize(size) {
      this.pageParam.size = size
      this.page(1)
    },
    /**
     * 授权失败重试
     * @param row
     */
    approveRetryButtonVisible(row) {
      return  row.state === '授权失败'
    },

    openApplyDialog(rowId, mode) {
      this.currentRowId = rowId
      this.mode = mode
      this.applyDialogVisible = true
    },

    openExcel(){
      excel().then(res => {
        download(res.data, '权限申请记录导出.xlsx')
      })
    },

    openDetailDialog(row) {
      this.currentRowId = row.id
      this.detailDialogVisible = true
    },

    openApproveDialog(row) {
      this.currentRowId = row.id
      this.approveDialogVisible = true
    },

    /**
     * 重试权限
     * @param id 权限申请id
     */
    retry(id) {
      this.$confirm('确定重试？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        retry(id).then(() => {
          this.$message({type: 'success', message: '提交重试申请成功'})
          this.page()
        })
      }).catch(() => {
        this.$message({type: 'info', message: '重试取消'})
      })
    },

    /**
     * 审批按钮是否可见
     * @param row 当前行
     * @returns {boolean} 是否可见
     */
    approveButtonVisible(row) {
      const authApproves = row.authApproves
      if (authApproves) {
        for (let i = 0; i < authApproves.length; i++) {
          let authApprove = authApproves[i]
          const bdpUserId = sessionStorage.getItem('bdpUserId')
          if ( authApprove.approveUser.id + '' === bdpUserId + '' && authApprove.isAgree === null) {
            return true
          }
        }
      }
      return false
    },
  },
}
</script>

<style scoped>

</style>
